<%@ page language="java" import="java.util.*" contentType="text/html"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		 <link rel="stylesheet" href='<c:url value="/share/bootstrap.min.css"></c:url>'> 
		 <script src='<c:url value="/js/jquery.min.js"></c:url>'></script>
		<script src='<c:url value="/js/bootstrap.min.js"></c:url>'></script>
		<script src='<c:url value="/js/all.js"></c:url>'></script> 
		<script type="text/javascript" src='<c:url value="/js/boot.js"></c:url>'></script>
		<script type="text/javascript"
		src='<c:url value="/js/rqfui/rqfui.js"></c:url>'></script>
		<style type="text/css">
			.header_nav_1,.header_nav_1_current{
				float: left;
				margin-right: 50px;
				margin-top: 35px;
			}
			.header_nav_2{
				float: right;
				margin-top: 35px;
			}
			.header_nav_1 span{
				background: #B8B8B8;
				color: #fff;
				padding:2px 6px;
				border-radius: 50%;
			}
			.header_nav_1 font{
				font-family: "微软雅黑";
				font-size: 18px;
				color: #b8b8b8;
				font-weight: 600;
			}
			.header_nav_1_current span{
				background: #2b5eae;
				color: #fff;
				padding:2px 6px;
				border-radius: 50%;
			}
			.header_nav_1_current font{
				font-family: "微软雅黑";
				font-size: 18px;
				color: #2b5eae;
				font-weight: 600;
			}
			
			.header_nav_2 div{
				float: left;
				font-family: "微软雅黑";
				font-size: 14px;
				font-weight: 600;
				color: #2b5eae;
				padding: 3px 20px;
				border: 1px solid #fff;
			}
			.header_nav_2 >div:hover{
				float: left;
				font-family: "微软雅黑";
				font-size: 14px;
				font-weight: 600;
				color: #fff !important;
				border: 1px solid #B8B8B8;
				background: #82bcff;
				padding: 3px 20px;
				border-radius: 2px;
			}
			hr {
			    margin-top: 10px;
			    margin-bottom: 30px;
			    border: 0;
			    border-top: 2px solid #2459aa;
			}
			.header_content_center{
				width: 790px;
				/*max-width: 1190px;*/
				margin: 0 auto;  
				position: relative;
			}
			.plus{
				font-size: 50px;
				color: #B8B8B8;
				margin-top:30% ;
				
				text-align: center;
			}
			.header_content_center_content_border{
				border: 1px dashed #B8B8B8;
				float: left;
				margin-bottom: 30px;
				width: 120px;
				height: 120px; 
				border-radius: 5px;
				margin-right: 60px;
			} 
			.header_content_center_content_text{
				margin: 15px 25px;
				color: #B8B8B8; 
				font-weight: 600;
			}
			
			.content_Examination_list_left>ul{
				padding: 0px;
				
			}
			.content_Examination_list_left>ul>li{
				width: 105px !important;
			    padding: 10px 30px;
			    background: #c4dfff;
			    color: #fff;
			    margin-bottom: 10px;
			    cursor : pointer;
			}
			
			.content_Examination_list_left{
				margin-top: 20px;
				padding: 0;
				width: 105px;
				left: -105px;
			}
			.jake_Wang_Bg295c96{
				background: #295c96 !important;
			}
			
			 .Examination_list>li{
				width: 790px;
				text-align: left;
				padding: 15px;
				margin-bottom: 15px;
				margin-top: 15px;
				border: 1px solid #494949;
				list-style-type:none;
			}
			.Examination_list>li:nth-child(1){
				margin-top: 0;
			}
			.Examination_list>li:nth-last-child(1){
				margin-bottom: 0;
			}
			.Examination_list_title{
				border: 1px solid #a4a4a4;
				padding: 6px 12px;
			}
			.Examination_list_title>span{
				background: #295c96;
			    color: #fff;
			    padding: 3px 6px;
			    border-radius: 50%;
			}
			.Examination_list_title>font {
				color:#295c96;
				word-wrap: break-word;
			}
			.Examination_list_content{
				border: 1px solid #a4a4a4;
				padding: 10px 25px;
				margin-top: 10px;
			}
			.Examination_list_content>li{
				width: 100% !important;
				position: relative;
	    		overflow: hidden;
	    		padding: 4px 0;
			}
			.Examination_list_content>li>input{
				float: left;
				margin-right: 10px;
			}
		</style>
	</head>
	<body >
		<div class="header_content_center">
			<div class="row" style="margin: 0 auto">
				<div class="header_nav_1">
					<span >1</span>
					<font >新建试卷</font>
				</div>
				<div class="header_nav_1_current">
					<span >2</span>
					<font >试卷组装</font>
				</div>
				<div class="header_nav_1 ">
					<span >3</span>
					<font >设置试卷</font>
				</div>
				<div class="header_nav_2">
					<div onclick="preview()" style="cursor:pointer;"> 
						预览
					</div>
					<div onclick="save()" style="cursor:pointer;"> 
						保存
					</div>
					<div onclick="last()" style="cursor:pointer;"> 
						上一步
					</div>
					<div onclick="next()" style="cursor:pointer;">
						下一步
					</div>
				</div>
			</div>
			
			<div>
				<hr />
			</div>
		</div>
		<div class="header_content_center">
			<div class="header_nav_btn">
				<div class="header_content_center_content_border" id="question_0" style="cursor:pointer;">
					<div class="plus">+</div>
					<div class="header_content_center_content_text">添加单选题</div>
				</div>
				<div class="header_content_center_content_border" id="question_1" style="cursor:pointer;">
					<div class="plus">+</div>
					<div class="header_content_center_content_text">添加多选题</div>
				</div>
				<div class="header_content_center_content_border" id="question_2" style="cursor:pointer;">
					<div class="plus">+</div>
					<div class="header_content_center_content_text">添加判断题</div>
				</div>
				<div class="header_content_center_content_border" id="question_3" style="cursor:pointer;">
					<div class="plus">+</div>
					<div class="header_content_center_content_text">添加解答题</div>
				</div>
				
			</div>
			<div id="all_list">
				<div class="col-xs-1 content_Examination_list_left">
					<ul >
						<li id = "one" class="jake_Wang_Bg295c96" style="display: none;">单选题</li>
						<li id = "much"style="display: none;">多选题</li>
						<li id ="judge" style="display: none;">判断题</li>
						<li id = "solution" style="display: none;">解答题</li>
					</ul>
				</div>
				<div  style="float: left;" id = "list">
					<ul class="Examination_list" style="margin-left: -145px;width: 100%;max-width: 1190px;" id="questionType_0">
					</ul>
					<ul class="Examination_list" style="margin-left: -145px;width: 100%;max-width: 1190px;" id="questionType_1">
					</ul>
					<ul class="Examination_list" style="margin-left: -145px;width: 100%;max-width: 1190px;" id="questionType_2">
					</ul>
					<ul class="Examination_list" style="margin-left: -145px;width: 100%;max-width: 1190px;" id="questionType_3">
					</ul>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript">
	var rootPath = '${rootPath}';
	var paperId = '${paperId}';
	var grading_way = '${grading_way}';
	
	$(function() {
		$(".header_content_center_content_border").mouseover(function  () {
			$(this).css("border-color","#2b5eae");
			$(this).children("div").css("color","#2b5eae");
		});
		$(".header_content_center_content_border").mouseout(function  () {
			$(this).css("border-color","#B8B8B8");
			$(this).children("div").css("color","#B8B8B8");
		});
		$(".content_Examination_list_left li").click(function  () {
			console.log($(this));
			if ($(this).index()==0) {
				$(".content_Examination_list_left li").not($(this)).removeClass();
				$(this).addClass("jake_Wang_Bg295c96");
				$("#questionType_0").show();
				$("#questionType_1").hide();
				$("#questionType_2").hide();
				$("#questionType_3").hide();
			}else if($(this).index()==1){
				$(".content_Examination_list_left li").not($(this)).removeClass();
				$(this).addClass("jake_Wang_Bg295c96");
				$("#questionType_0").hide();
				$("#questionType_1").show();
				$("#questionType_2").hide();
				$("#questionType_3").hide();
			}else if($(this).index()==2){
				$(".content_Examination_list_left li").not($(this)).removeClass();
				$(this).addClass("jake_Wang_Bg295c96");
				$("#questionType_0").hide();
				$("#questionType_1").hide();
				$("#questionType_2").show();
				$("#questionType_3").hide();
			}else if($(this).index()==3){
				$(".content_Examination_list_left li").not($(this)).removeClass();
				$(this).addClass("jake_Wang_Bg295c96");
				$("#questionType_0").hide();
				$("#questionType_1").hide();
				$("#questionType_2").hide();
				$("#questionType_3").show();
			}
		});
	});
	function last(){
		save(function(){
			location.href = rootPath + "/testPaper/updateMv/" + paperId;
		})
	}
	
	function next(){
		save(function(){
			location.href = rootPath + "/testPaper/paperSetup/" + paperId;
		})
	}
	if(grading_way=="auto"){
		$("#question_3").hide();
		$("#question_2").css({"margin-right":"240px"});
	}
	$("#question_0").click(function(){
		getQuestionList("单选题");
	});
	$("#question_1").click(function(){
		getQuestionList("多选题");
	});
	$("#question_2").click(function(){
		getQuestionList("判断题");
	});
	$("#question_3").click(function(){
		getQuestionList("解答题");
	});
	function preview(){
		save(function(){
			window.open(rootPath + '/testPaper/checkMv/' + paperId); 
		})
	}
	var questionId="";
	function getQuestionList(type){
		mini.open({
    	    url: rootPath + "/testPaper/questionListMv/" + type,
    	    title: "选择列表", width: 900, height: 600,
    	    onload: function () {
    	    },
    	    ondestroy: function(action) {
    	    	if(action == "close"){
    	    		
    	    	}else{
    	    		var str = action.split(",");
   	    			for(var i = 0; i < str.length;i++){
   	    				if(questionId == ""){
   	    					questionId += str[i];
   	    				}else if(questionId.indexOf(str[i])< 0){
   	        	    		questionId += "," + str[i];
   	    				}
   	    			}
	    	    	getTestList(questionId);
    	    	}
    	    }
    	}); 
	}
	function showTest(data) {
		var htmStr0=""; 
		var htmStr1=""; 
		var htmStr2=""; 
		var htmStr3=""; 
		var htmStr="";
		$(".content_Examination_list_left ul").show();
		if(!data){
			$(".content_Examination_list_left ul").hide();
			//return;
		}
		
		for(var i = 0; i < data.length; i++){
			if (data[i].class_id == "单选题") {
				htmStr0 += "<li><div class=\"close\" style=\"margin-top:-15px;margin-right: -45px;\">"
					+ "<a onclick=\"_delete("+data[i].id+")\"><img src=\""+rootPath+"/share/img/icon/close_02.png\" class=\"deleteEle\" alt=\"关闭\" /></a>"
					+ "</div>"
					+ "<div class=\"Examination_list_title\">"
					+ "<font>"
					+ data[i].question
					+ "</font>"
					+ "</div>"
					+ "<ul class=\"Examination_list_content\">";
				var str = data[i].selects;
				var arr = str.split(",nwebadjj,_");
				for (var j = 0; j < arr.length; j++) {
					var option = String.fromCharCode(j + 65);
					htmStr0 += "<li>"
							+ "<input type=\"radio\" name=\"radio1\" />&nbsp;"
							+ "<font>" + option + '、' + arr[j] + "</font>"
							+ "</li>";
				}
				htmStr0 += "</ul></li>";
			}else if (data[i].class_id == "多选题") {
				htmStr1 += "<li><div class=\"close\" style=\"margin-top:-15px;margin-right: -45px;\">"
					+ "<a onclick=\"_delete("+data[i].id+")\"><img src=\""+rootPath+"/share/img/icon/close_02.png\" class=\"deleteEle\" alt=\"关闭\" /></a>"
					+ "</div>"
					+ "<div class=\"Examination_list_title\">"
					+ "<font>"
					+ data[i].question
					+ "</font>"
					+ "</div>"
					+ "<ul class=\"Examination_list_content\">";
				var str = data[i].selects;
				var arr = str.split(",nwebadjj,_");
				for (var j = 0; j < arr.length; j++) {
					var option = String.fromCharCode(j + 65);
					htmStr1 += "<li>"
							+ "<input type=\"checkbox\" name=\"check1\" />&nbsp;"
							+ "<font>" + option + '、' + arr[j] + "</font>"
							+ "</li>";
				}
				htmStr1 += "</ul></li>";
			}else if (data[i].class_id == "判断题") {
				htmStr2 += "<li><div class=\"close\" style=\"margin-top:-15px;margin-right: -45px;\">"
					+ "<a onclick=\"_delete("+data[i].id+")\"><img src=\""+rootPath+"/share/img/icon/close_02.png\" class=\"deleteEle\" alt=\"关闭\" /></a>"
					+ "</div>"
					+ "<div class=\"Examination_list_title\">"
					+ "<font>"
					+ data[i].question
					+ "</font>"
					+ "</div>"
					+ "<ul class=\"Examination_list_content\">";
				htmStr2 += "<li><input type=\"radio\" name=\"radio1\" />&nbsp;<font>是</font>"
							+ "</li><li><input type=\"radio\" name=\"radio1\" />&nbsp;<font>否</font>"
							+ "</li>";
				htmStr2 += "</ul></li>";
			}else if (data[i].class_id == "解答题") {
				htmStr3 += "<li><div class=\"close\" style=\"margin-top:-15px;margin-right: -45px;\">"
					+ "<a onclick=\"_delete("+data[i].id+")\"><img src=\""+rootPath+"/share/img/icon/close_02.png\" class=\"deleteEle\" alt=\"关闭\" /></a>"
					+ "</div>"
					+ "<div class=\"Examination_list_title\">"
					+ "<font>"
					+ data[i].question
					+ "</font>"
					+ "</div>"
					+ "<ul class=\"Examination_list_content\">";
				htmStr3 += "<p style =\"height:45px\"></p>";
				htmStr3 += "</ul></li>";
			}
		}
		if(htmStr0){
			$("#question_0").show();
			$("#questionType_0").html(htmStr0);
			$(".content_Examination_list_left ul li:eq(0)").show();
		}else{
			$(".content_Examination_list_left ul li:eq(0)").hide();
		}
		if(htmStr1){
			$("#questionType_1").html(htmStr1);
			$("#question_1").show();
			$(".content_Examination_list_left ul li:eq(1)").show();
		}else{
			$(".content_Examination_list_left ul li:eq(1)").hide();
		}
		if(htmStr2){
			$("#questionType_2").html(htmStr2);
			$("#question_2").show();
			$(".content_Examination_list_left ul li:eq(2)").show();
		}else{
			$(".content_Examination_list_left ul li:eq(2)").hide();
		}
		if(htmStr3){
			$("#question_3").show();
			$("#questionType_3").html(htmStr3);
			$(".content_Examination_list_left ul li:eq(3)").show();
		}else{
			$(".content_Examination_list_left ul li:eq(3)").hide();
		}
		
		
		$(".deleteEle").click(function() {
			var num = $(this).parent().parent().parent().parent()[0].id;
			var numm = num.charAt(num.length - 1);
			if($(this).parent().parent().parent().parent().children().length==1){
				console.log(888);
				$("#type_"+numm+"").hide();
			}
			$(this).parent().parent().parent().remove();
		});
	}

		function getTestList(id) {
			var url = rootPath + "/testPaper/questionListData";
			$.ajax({
				url : url,
				method : "post",
				dataType : "json",
				data : {'data':id},
				success : function(data) {
					if (data) {
						showTest(data);
					} else {
						alert("获取信息失败！");
					}
				},
				error : function() {
					alert("失败！");
				}
			});
		}
		function save(callBackfunction) {
			if (!questionId) {
				if (callBackfunction) {
					callBackfunction();
				}else{
					alert("请添加试题！");
				}
				return;
			} else {
				var url = rootPath + "/testPaper/addTest/" + paperId;
				$.ajax({
					url : url,
					method : "post",
					dataType : "json",
					data : {
						'data' : questionId
					},
					success : function(data) {
						if (data) {
							alert("保存成功");
							if (callBackfunction) {
								callBackfunction();
							}
						} else {
							alert("保存失败！");
						}
					},
					error : function() {
						alert("失败！");
					}
				});
			}
		}
	
		function _delete(id) {
			var i = questionId.indexOf(id);
			if (questionId.length == 2) {
				questionId = "";
				$("#all_list").html("");
			}else if(i==0){
				questionId = questionId.replace(id+",","");
			}else{
				questionId = questionId.replace(","+id,"");
			}
			testId = questionId;
			//getTestList(questionId);
		}
	</script>
</html>
